﻿@{
    Layout = "~/Views/Shared/_FormWhite.cshtml";
}

@inject Microsoft.AspNetCore.Hosting.IWebHostEnvironment HostingEnvironment
@section header{
    <link href="@Url.Content("~/lib/summernote/0.8.15/summernote.min.css")" rel="stylesheet" type="text/css">
    <script src='@Url.Content("~/lib/summernote/0.8.15/summernote.js")' type="text/javascript"></script>
    <script src='@Url.Content("~/lib/summernote/0.8.15/lang/summernote-zh-CN.min.js")' type="text/javascript"></script>

    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/imageupload/1.0/css/imgup.min.css"))
    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/imageupload/1.0/js/imgup.min.js"))

    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/bootstrap.tagsinput/0.8.0/bootstrap-tagsinput.min.css"))
    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/bootstrap.tagsinput/0.8.0/bootstrap-tagsinput.min.js"))

    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/layui/2.7.6/css/layui.css"))
    @BundlerHelper.Render(HostingEnvironment.ContentRootPath, Url.Content("~/lib/layui/2.7.6/layui.js"))
}
  <style>
        .layui-table-cell {
            line-height: 28px;
        }
    </style>
<div class="wrapper animated fadeInRight">
    <form id="form" class="form-horizontal m">
        <div class="form-group">
            <label class="col-sm-2 control-label ">订单编号<font class="red"> *</font></label>
            <div class="col-sm-4">
                <input id="order_sn" col="order_sn" readonly="readonly" type="text" class="form-control" />
            </div>
            <label class="col-sm-2 control-label ">收货人姓名<font class="red"> *</font></label>
            <div class="col-sm-4">
                <input id="shipping_user" col="shipping_user" readonly="readonly" type="text" class="form-control" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label ">支付订单号</label>
            <div class="col-sm-4">
                <input id="ordernumber" col="ordernumber" readonly="readonly" type="text" class="form-control" />
            </div>
            <label class="col-sm-2 control-label ">收货人电话</label>
            <div class="col-sm-4">
                <input id="ship_mobile" col="ship_mobile" readonly="readonly" type="text" class="form-control" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label ">物流方式</label>
            <div class="col-sm-4">
                <input id="delivery_company" col="delivery_company" readonly="readonly" type="text" class="form-control" />
            </div>
            <label class="col-sm-2 control-label ">物流单号</label>
            <div class="col-sm-4">
                <input id="delivery_sn" col="delivery_sn" readonly="readonly" type="text" class="form-control" />
            </div>
        </div>
        @*<div class="form-group">
            <label class="col-sm-2 control-label ">
                <span>订单商品图片</span><br />
                <span>(宽高比 1.5：1)</span>
            </label>
            <div class="col-sm-10">
                <div id="goods_image" class="img-box">
                </div>
            </div>
        </div>*@
        <div class="form-group">
            <label class="col-sm-2 control-label ">车辆明显</label>
            <div class="col-sm-10">
                <table class="layui-hide" id="tableId"></table>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label ">订单金额</label>
            <div class="col-sm-4">
                <input id="order_money" col="order_money" type="text" readonly="readonly" class="form-control" />
            </div>
            <label class="col-sm-2 control-label ">支付金额</label>
            <div class="col-sm-4">
                <input id="payment_money" col="payment_money" readonly="readonly" type="text" class="form-control" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label ">下单时间</label>
            <div class="col-sm-4">
                <input id="create_time" col="create_time" readonly="readonly" type="text" class="form-control" />
            </div>
            <label class="col-sm-2 control-label ">发货时间</label>
            <div class="col-sm-4">
                <input id="shipping_time" col="shipping_time" type="text" readonly="readonly" class="form-control" placeholder="请选择" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label ">支付时间</label>
            <div class="col-sm-4">
                <input id="pay_time" col="pay_time" readonly="readonly" type="text" class="form-control" />
            </div>
            <label class="col-sm-2 control-label ">收货时间</label>
            <div class="col-sm-4">
                <input id="receive_time" col="receive_time" readonly="readonly" type="text" class="form-control" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label ">订单状态</label>
            <div class="col-sm-4">
                <input id="order_status_doc" col="order_status_doc" readonly="readonly" type="text" class="form-control" />
            </div>
            <label class="col-sm-2 control-label ">购买数量</label>
            <div class="col-sm-4">
                <input id="product_cnt" col="product_cnt" readonly="readonly" type="text" class="form-control" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label ">省</label>
            <div class="col-sm-4">
                <input id="province" col="province" type="text" readonly="readonly" class="form-control" />
            </div>
            <label class="col-sm-2 control-label ">市</label>
            <div class="col-sm-4">
                <input id="city" col="city" type="text" readonly="readonly" class="form-control" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label ">区</label>
            <div class="col-sm-4">
                <input id="district" col="district" type="text" readonly="readonly" class="form-control" />
            </div>
            <label class="col-sm-2 control-label ">支付渠道</label>
            <div class="col-sm-4">
                <div id="payment_method_doc" col="payment_method_doc" readonly="readonly" type="text" class="form-control" />
            </div>
        </div>
        <div class="form-group" style="margin-top:45px;margin-left:-3px;margin-right:-3px;">
            <label class="col-sm-2 control-label ">详细地址</label>
            <div class="col-sm-10">
                <textarea id="address" col="address" readonly="readonly" class="form-control"></textarea>
            </div>
        </div>
    </form>
</div>

<script type="text/javascript">
    var id = ys.request("id");
    $(function () {
        laydate.render({ elem: '#shipping_time', format: 'yyyy-MM-dd' });
        $("#order_status").ysComboBox({
            data: ys.getJson(@Html.Raw(typeof(OrderStatusEnum).EnumToDictionaryString())),
            class: "form-control"
        });

        $("#goods_image").imageUpload({ uploadImage: 'uploadThumbImage', limit: 1, context: ctx });

        getForm();

        $('#form').validate({
            rules: {
                order_sn: { required: true }
            }
        });
    });

    layui.use(['form', 'table'], function() {
        var table = layui.table;
        var form = layui.form;
        // 已知数据渲染
        var inst = table.render({
            elem: '#tableId',
            url: '@Url.Content("~/QixingManage/OrderDetail/GetPageColourDetailList")',
            where: {orderid:id,order_status:-1}, //如果无需传递额外参数，可不加该参数
            lineStyle: 'height: 151px;', // 定义表格的多行样式
            cols: [[ //标题栏
                { field: 'goods_name', title: '商品名称'},
                { field: 'goods_image', title: '商品图片', width: 120, minWidth: 120, templet: '<div><img src="{{d.goods_image}}" style="max-width:100px;height:100px;"></div>' },
                { field: 'skuname', title: '颜色', width: 80 },
                {
                    field: 'goods_cnt', title: '数量', width: 80, templet: function(d) {
                        return 'x' + d.product_cnt;
                    }
                },
                {
                    field: 'goods_price', title: '基础价格', width: 80
                },
                {
                    field: 'member_price', title: '会员价格', width: 80
                },
                { field: 'VIN', title: '车架号'},
            ]],
            skin: 'line', // 表格风格
            //even: true,
            page: false, // 是否显示分页
            parseData: function(res) { // res 即为原始返回的数据
                return {
                    "code": res.Tag == 1 ? 0 : -1, // 解析接口状态
                    "msg": res.Message, // 解析提示文本
                    "count": res.Total, // 解析数据长度
                    "data": res.Data // 解析数据列表
                };
            },
        });
    });

    function getForm() {
        if (id > 0) {
            ys.ajax({
                url: '@Url.Content("~/QixingManage/OrderMaster/GetMasterOrderFormJson")' + '?id=' + id,
                type: 'get',
                success: function (obj) {
                    if (obj.Tag == 1) {
                        $('#form').setWebControls(obj.Data);
                    }
                }
            });
        }
        else {
            var defaultData = {};
            $('#form').setWebControls(defaultData);
        }
    }
</script>

